<!DOCTYPE html>
<html lang="zh-cn">
    <head>
        <meta charset="UTF-8"/>
        <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
        <title>Document</title>
        <link rel="stylesheet" href="stylesheets/screen.css" />
        <link href="stylesheets/print.css" media="print" rel="stylesheet" type="text/css" />
    </head>
    <body>
        <h1>Sass和Compass必备技能之Compass</h1>
        <p>来源:慕课网<a href="https://www.imooc.com/learn/371">https://www.imooc.com/learn/371</a></p>
        <h1>github仓库地址</h1>
        <p>来源:<a href="https://github.com/logan70/learn-sass-compass"></a>https://github.com/logan70/learn-sass-compass</p>
        <!-- <div class="error">你今天没有学习技术哦！不进则退。</div>
        <div class="serious-error">oh no!你一周没有学习新技术了！快来看看本周出来那些课程吧！</div> -->
        <!-- <div id="root">
            root
           <div id="root_footer">abcd</div>
         </div>
         <div id="footer">
           Footer content goes here.
         </div> -->
         <!-- <h1>Compass</h1>
         <h2>delimited-list(1separator)</h2>
         <p>makes an inline list delimited with the passed string. Defaults to making a comma-separated list.</p>
         <p>Please make note of the browser support issues before using this mixin:</p>
         <p>use of content and :after is not fully supported in all browsers. See quirksmode for the support matrix</p>
         <p>:last-child is not fully supported. see quirksmode for the support matrix.</p>
         <p>IE8 ignores rules that are included on the same line as :last-child see http://www.richardscarrott.co.uk/posts/view/ie8-last-child-bug for details</p> -->
         <table class="good-price" cellspacing="0">
            <thead>
                <tr class="odd">
                    <th>水果名称</th>
                    <th>价格(元/斤)</th>
                    <th>销量(斤)</th>
                    <th>库存(斤)</th>
                </tr>
            </thead>
            <tbody>
                <tr class="even">
                    <th>香蕉</th>
                    <td class="numeric">2.00</td>
                    <td class="numeric">100</td>
                    <td class="numeric">100</td>
                </tr>
                <tr class="odd">
                    <th>苹果</th>
                    <td class="numeric">2.00</td>
                    <td class="numeric">100</td>
                    <td class="numeric">100</td>
                </tr>
                <tr class="even">
                    <th>橘子</th>
                    <td class="numeric">2.00</td>
                    <td class="numeric">100</td>
                    <td class="numeric">100</td>
                </tr>
                <tr class="odd">
                    <th>葡萄</th>
                    <td class="numeric">2.00</td>
                    <td class="numeric">100</td>
                    <td class="numeric">100</td>
                </tr>
            </tbody>
            <tfoot>
                <tr class="even">
                    <th>总计</th>
                    <td class="numeric">2.00</td>
                    <td class="numeric">400</td>
                    <td class="numeric">400</td>
                </tr>
            </tfoot>
         </table>
         <div class="tag-cloud">
             <span class="s">好好学习</span>
             <span class="l">劳逸结合</span>
             <span class="xs">人之间的区别在于工作之后的5个小时</span>
             <span class="xl">小狗钱钱</span>
             <span class="xxl">我要买房子</span>
             <span class="xxs">我要很多钱</span>
             <span>实现梦想，始于足下</span>
         </div>
         <div class="icon-w10_l bg"></div>
         <div class="tianqi-icon"></div>
    </body>
</html>